<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./iconfont/iconfont.css" />
</head>

<body>
    <div class="top">
        <div class="container">
            <!-- 头部导航 -->
            <div class="top-nav">
                <ul>
                    <li><a href="" class="top-nav-active">请先登录</a></li>
                    <li><a href="">免费注册</a></li>
                    <li><a href="">我的订单</a></li>
                    <li><a href="">会员中心</a></li>
                    <li><a href="">帮助中心</a></li>
                    <li><a href="">在线客服</a></li>
                    <li class="top-download-show">
                        <a href="" class="top-nav-special"><span class="iconfont">&#xe678;</span>手机版</a>
                        <div class="top-download">
                            <img src="./images/app.png" alt="" />
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container">
        <!-- 头部tab栏 -->
        <div class="top-tab">
            <div class="top-tab-logo">
                <img src="./images/logo.png" alt="" />
            </div>
            <div class="top-tab-nav">
                <ul>
                    <li><a href="#">首页</a></li>
                    <li><a href="#">生鲜</a></li>
                    <li><a href="#">美食</a></li>
                    <li><a href="#">餐厨</a></li>
                    <li><a href="#">电器</a></li>
                    <li><a href="#">居家</a></li>
                    <li><a href="#">洗护</a></li>
                    <li><a href="#">孕婴</a></li>
                    <li><a href="#">服装</a></li>
                </ul>
            </div>
            <div class="top-tab-seach">
                <a href="#">
                    <span class="iconfont icon-search"> </span><input type="search" placeholder="搜一搜" />
                </a>

                <span class="iconfont icon-cart-full"></span>
            </div>
        </div>
        <!-- banner   -->
        <div class="banner">
            <div class="banner-nav">
                <ul>
                    <li>
                        <a href="#"> <span>生鲜</span> 水果 蔬菜 </a>
                    </li>
                    <li>
                        <a href="#"> <span>美食</span> 面点 干果 </a>
                    </li>
                    <li>
                        <a href="#"> <span>餐厨</span> 数码产品 </a>
                    </li>
                    <li>
                        <a href="#"> <span>电器</span> 床品 四件套 被枕 </a>
                    </li>
                    <li>
                        <a href="#"> <span>居家</span> 奶粉 玩具 辅食 </a>
                    </li>
                    <li>
                        <a href="#"> <span>洗护</span> 洗发 洗护 美妆 </a>
                    </li>
                    <li>
                        <a href="#"> <span>孕婴</span> 奶粉 玩具 </a>
                    </li>
                    <li>
                        <a href="#"> <span>服饰</span> 女装 男装 </a>
                    </li>
                    <li>
                        <a href="#"> <span>杂货</span> 户外 图书 </a>
                    </li>
                    <li>
                        <a href="#"> <span>品牌</span> 品牌制造 </a>
                    </li>
                </ul>
            </div>
            <ul class="banner-dot">
                <li class="dot-active">
                    <i></i>
                </li>
                <li>
                    <i></i>
                </li>
                <li>
                    <i></i>
                </li>
            </ul>
        </div>
        <!-- 新鲜好物 -->
        <div class="good">
            <div class="good-title">
                <div class="good-title-left">
                    <h2>新鲜好物 <span>新鲜出炉 品质靠谱</span></h2>
                </div>
                <div class="good-title-right">
                    <a href="#">查看全部
                        <span class="iconfont icon-arrow-right-bold"></span>
                    </a>
                </div>
            </div>
            <div class="good-main">
                <ul>
                    <li>
                        <a href="#">
                            <img src="./images/goods1.png" alt="" />
                            <div class="good-main-txt">
                                <h4>KN95级莫兰迪色防护口罩</h4>
                                <p>￥ <span>79</span></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/goods2.png" alt="" />
                            <div class="good-main-txt">
                                <h4>紫檀外独版三层普洱茶盒</h4>
                                <p>￥ <span>566</span></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/goods3.png" alt="" />
                            <div class="good-main-txt">
                                <h4>法拉蒙颜值记事本可定制</h4>
                                <p>￥ <span>58</span></p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/goods4.png" alt="" />
                            <div class="good-main-txt">
                                <h4>科技布布艺沙发</h4>
                                <p>￥ <span>3579</span></p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 人气推荐 -->
        <div class="hot">
            <div class="good-title">
                <div class="good-title-left">
                    <h2>人气推荐 <span>人气爆款 不容错过</span></h2>
                </div>
                <div class="good-title-right">
                    <a href="#">查看全部
                        <span class="iconfont icon-arrow-right-bold"></span>
                    </a>
                </div>
            </div>
            <div class="hot-main">
                <ul>
                    <li>
                        <a href="#">
                            <img src="./images/recommend1.png" alt="" />
                            <div class="hot-main-txt">
                                <h4>特惠推荐</h4>
                                <p>我猜得到 你的需要</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/recommend2.png" alt="" />
                            <div class="hot-main-txt">
                                <h4>爆款推荐</h4>
                                <p>人气好物推荐</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/recommend3.png" alt="" />
                            <div class="hot-main-txt">
                                <h4>节日礼品一站买全</h4>
                                <p>编辑尽心整理推荐</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/recommend4.png" alt="" />
                            <div class="hot-main-txt">
                                <h4>鲜花园艺</h4>
                                <p>给生活增加仪式感</p>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 热门品牌 -->
        <div class="brand">
            <div class="brand-title">
                <div class="brand-title-left">
                    <h2>热门品牌 <span>国际经典 品质认证</span></h2>
                </div>
                <div class="brand-title-right">
                    <span class="iconfont icon-arrow-left-bold"></span>
                    <span class="iconfont icon-arrow-right-bold"></span>
                </div>
            </div>
            <div class="brand-main">
                <ul>
                    <li>
                        <a href="#">
                            <img src="./images/hot1.png" alt="" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/hot2.png" alt="" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/hot3.png" alt="" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/hot4.png" alt="" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="./images/hot5.png" alt="" />
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- 生鲜 -->
        <div class="fresh">
            <div class="fresh-title">
                <div class="fresh-title-left">
                    <h2>生鲜</h2>
                </div>
                <div class="fresh-title-right">
                    <div class="right-tab">
                        <ul>
                            <li>
                                <a href="#">热门</a>
                            </li>
                            <li>
                                <a href="#">蔬菜</a>
                            </li>
                            <li>
                                <a href="#">肉禽蛋</a>
                            </li>
                            <li>
                                <a href="#">水果</a>
                            </li>
                            <li>
                                <a href="#">海鲜</a>
                            </li>
                            <li>
                                <a href="#">零食</a>
                            </li>
                            <li>
                                <a href="#">饮料</a>
                            </li>
                        </ul>
                    </div>
                    <div class="right-more">
                        <a href="#">查看全部
                            <span class="iconfont icon-arrow-right-bold"></span>
                        </a>
                    </div>
                </div>
            </div>
            <div class="fresh-main">
                <div class="fresh-main-left">
                    <img src="./images/fresh_left.png" alt="" />
                </div>
                <div class="fresh-main-right">
                    <ul>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh1.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>双味千层，手抓饼烤肉组合</h3>
                                        <p>240g/袋 4片装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>89.9</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh2.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>云南甘蔗慢熬红糖馒头</h3>
                                        <p>220g/袋 5个装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>9.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh3.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>日式风味小圆饼</h3>
                                        <p>圆形【海盐味】</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>588.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh4.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>全麦奶油浓香小面包</h3>
                                        <p>50g*12袋</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>69.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh5.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>秘制外皮五福摩提大福点心</h3>
                                        <p>150g/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh6.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>水果面膜韩国蜂蜜柚子茶</h3>
                                        <p>560g/瓶</p>
                                        <p>冲调饮品</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh7.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>浓情比利时巧克力礼盒装</h3>
                                        <p>2205克/盒</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>120</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh8.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>抹茶奶油小蛋糕礼盒装</h3>
                                        <p>220克/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>60.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 生鲜 -->
        <div class="fresh">
            <div class="fresh-title">
                <div class="fresh-title-left">
                    <h2>生鲜</h2>
                </div>
                <div class="fresh-title-right">
                    <div class="right-tab">
                        <ul>
                            <li>
                                <a href="#">热门</a>
                            </li>
                            <li>
                                <a href="#">蔬菜</a>
                            </li>
                            <li>
                                <a href="#">肉禽蛋</a>
                            </li>
                            <li>
                                <a href="#">水果</a>
                            </li>
                            <li>
                                <a href="#">海鲜</a>
                            </li>
                            <li>
                                <a href="#">零食</a>
                            </li>
                            <li>
                                <a href="#">饮料</a>
                            </li>
                        </ul>
                    </div>
                    <div class="right-more">
                        <a href="#">查看全部
                            <span class="iconfont icon-arrow-right-bold"></span>
                        </a>
                    </div>
                </div>
            </div>
            <div class="fresh-main">
                <div class="fresh-main-left">
                    <img src="./images/fresh_left.png" alt="" />
                </div>
                <div class="fresh-main-right">
                    <ul>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh1.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>双味千层，手抓饼烤肉组合</h3>
                                        <p>240g/袋 4片装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>89.9</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh2.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>云南甘蔗慢熬红糖馒头</h3>
                                        <p>220g/袋 5个装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>9.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh3.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>日式风味小圆饼</h3>
                                        <p>圆形【海盐味】</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>588.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh4.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>全麦奶油浓香小面包</h3>
                                        <p>50g*12袋</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>69.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh5.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>秘制外皮五福摩提大福点心</h3>
                                        <p>150g/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh6.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>水果面膜韩国蜂蜜柚子茶</h3>
                                        <p>560g/瓶</p>
                                        <p>冲调饮品</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh7.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>浓情比利时巧克力礼盒装</h3>
                                        <p>2205克/盒</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>120</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh8.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>抹茶奶油小蛋糕礼盒装</h3>
                                        <p>220克/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>60.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div> <!-- 生鲜 -->
        <div class="fresh">
            <div class="fresh-title">
                <div class="fresh-title-left">
                    <h2>生鲜</h2>
                </div>
                <div class="fresh-title-right">
                    <div class="right-tab">
                        <ul>
                            <li>
                                <a href="#">热门</a>
                            </li>
                            <li>
                                <a href="#">蔬菜</a>
                            </li>
                            <li>
                                <a href="#">肉禽蛋</a>
                            </li>
                            <li>
                                <a href="#">水果</a>
                            </li>
                            <li>
                                <a href="#">海鲜</a>
                            </li>
                            <li>
                                <a href="#">零食</a>
                            </li>
                            <li>
                                <a href="#">饮料</a>
                            </li>
                        </ul>
                    </div>
                    <div class="right-more">
                        <a href="#">查看全部
                            <span class="iconfont icon-arrow-right-bold"></span>
                        </a>
                    </div>
                </div>
            </div>
            <div class="fresh-main">
                <div class="fresh-main-left">
                    <img src="./images/fresh_left.png" alt="" />
                </div>
                <div class="fresh-main-right">
                    <ul>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh1.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>双味千层，手抓饼烤肉组合</h3>
                                        <p>240g/袋 4片装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>89.9</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh2.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>云南甘蔗慢熬红糖馒头</h3>
                                        <p>220g/袋 5个装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>9.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh3.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>日式风味小圆饼</h3>
                                        <p>圆形【海盐味】</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>588.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh4.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>全麦奶油浓香小面包</h3>
                                        <p>50g*12袋</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>69.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh5.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>秘制外皮五福摩提大福点心</h3>
                                        <p>150g/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh6.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>水果面膜韩国蜂蜜柚子茶</h3>
                                        <p>560g/瓶</p>
                                        <p>冲调饮品</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh7.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>浓情比利时巧克力礼盒装</h3>
                                        <p>2205克/盒</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>120</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh8.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>抹茶奶油小蛋糕礼盒装</h3>
                                        <p>220克/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>60.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div> <!-- 生鲜 -->
        <div class="fresh">
            <div class="fresh-title">
                <div class="fresh-title-left">
                    <h2>生鲜</h2>
                </div>
                <div class="fresh-title-right">
                    <div class="right-tab">
                        <ul>
                            <li>
                                <a href="#">热门</a>
                            </li>
                            <li>
                                <a href="#">蔬菜</a>
                            </li>
                            <li>
                                <a href="#">肉禽蛋</a>
                            </li>
                            <li>
                                <a href="#">水果</a>
                            </li>
                            <li>
                                <a href="#">海鲜</a>
                            </li>
                            <li>
                                <a href="#">零食</a>
                            </li>
                            <li>
                                <a href="#">饮料</a>
                            </li>
                        </ul>
                    </div>
                    <div class="right-more">
                        <a href="#">查看全部
                            <span class="iconfont icon-arrow-right-bold"></span>
                        </a>
                    </div>
                </div>
            </div>
            <div class="fresh-main">
                <div class="fresh-main-left">
                    <img src="./images/fresh_left.png" alt="" />
                </div>
                <div class="fresh-main-right">
                    <ul>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh1.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>双味千层，手抓饼烤肉组合</h3>
                                        <p>240g/袋 4片装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>89.9</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh2.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>云南甘蔗慢熬红糖馒头</h3>
                                        <p>220g/袋 5个装</p>
                                        <p>加热即食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>9.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh3.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>日式风味小圆饼</h3>
                                        <p>圆形【海盐味】</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>588.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh4.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>全麦奶油浓香小面包</h3>
                                        <p>50g*12袋</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>69.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh5.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>秘制外皮五福摩提大福点心</h3>
                                        <p>150g/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh6.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>水果面膜韩国蜂蜜柚子茶</h3>
                                        <p>560g/瓶</p>
                                        <p>冲调饮品</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>39.99</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh7.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>浓情比利时巧克力礼盒装</h3>
                                        <p>2205克/盒</p>
                                        <p>糖果零食</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>120</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="main-right-pic">
                                    <img src="./images/fresh8.png" alt="" />
                                </div>

                                <div class="main-right-txt">
                                    <div class="txt-info">
                                        <h3>抹茶奶油小蛋糕礼盒装</h3>
                                        <p>220克/盒</p>
                                        <p>美味西点</p>
                                    </div>
                                    <div class="info-pri">
                                        <p>￥<span>60.00</span></p>
                                    </div>

                                </div>
                            </a>
                            <!-- 鼠标悬浮提示 -->
                            <div class="main-right-prompt">
                                <h3>找相似</h3>
                                <a href="">
                                    <p>发现更多宝贝 <span class="iconfont icon-arrow-right-bold"></span></p>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 最新专题 -->
        <div class="news">
            <div class="news-title">
                <div class="news-title-left">
                    <h3>最新专题</h3>
                </div>
                <div class="news-title-right">
                    <a href="#">
                        查看全部
                        <span class="iconfont icon-arrow-right-bold"></span>
                    </a>
                </div>
            </div>
            <div class="news-main">
                <ul>
                    <li>
                        <a href="#">
                            <div class="news-pic">
                                <img src="./images/topic1.png" alt="">
                                <div class="news-main-cover">
                                    <div class="news-main-cover-left">
                                        <h4>吃这些美食才不算辜负自己</h4>
                                        <p>餐厨起居洗护好物</p>
                                    </div>
                                    <div class="news-main-conver-right">
                                        <span>￥</span>29.9起
                                    </div>
                                </div>
                            </div>
                            <div class="news-txt clearfix">
                                <div class="news-txt-left">
                                    <a href="#">
                                        <span class="iconfont icon-fabulous"></span>1220
                                    </a>
                                    <a href="#">
                                        <span class="iconfont icon-browse"></span>1800
                                    </a>
                                </div>
                                <div class="news-txt-right">
                                    <a href="#">
                                        <span class="iconfont icon-comment
                                        "></span>246
                                    </a>
                                </div>
                            </div>
                        </a>

                    </li>
                    <li>
                        <a href="#">
                            <div class="news-pic">
                                <img src="./images/topic2.png" alt="">
                                <div class="news-main-cover">
                                    <div class="news-main-cover-left">
                                        <h4>吃这些美食才不算辜负自己</h4>
                                        <p>餐厨起居洗护好物</p>
                                    </div>
                                    <div class="news-main-conver-right">
                                        <span>￥</span>29.9起
                                    </div>
                                </div>
                            </div>
                            <div class="news-txt clearfix">
                                <div class="news-txt-left">
                                    <a href="#">
                                        <span class="iconfont icon-fabulous"></span>1220
                                    </a>
                                    <a href="#">
                                        <span class="iconfont icon-browse"></span>1800
                                    </a>
                                </div>
                                <div class="news-txt-right">
                                    <a href="#">
                                        <span class="iconfont icon-comment
                                        "></span>246
                                    </a>
                                </div>
                            </div>
                        </a>

                    </li>
                    <li>
                        <a href="#">
                            <div class="news-pic">
                                <img src="./images/topic3.png" alt="">
                                <div class="news-main-cover">
                                    <div class="news-main-cover-left">
                                        <h4>吃这些美食才不算辜负自己</h4>
                                        <p>餐厨起居洗护好物</p>
                                    </div>
                                    <div class="news-main-conver-right">
                                        <span>￥</span>29.9起
                                    </div>
                                </div>
                            </div>
                            <div class="news-txt clearfix">
                                <div class="news-txt-left">
                                    <a href="#">
                                        <span class="iconfont icon-fabulous"></span>1220
                                    </a>
                                    <a href="#">
                                        <span class="iconfont icon-browse"></span>1800
                                    </a>
                                </div>
                                <div class="news-txt-right">
                                    <a href="#">
                                        <span class="iconfont icon-comment
                                        "></span>246
                                    </a>
                                </div>
                            </div>
                        </a>

                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 尾栏 -->
    <div class="footer">
        <div class="container">
            <div class="footer-top">
                <ul>
                    <li>
                        <a href="#"></a>
                        <p>价格亲民</p>
                    </li>
                    <li>
                        <a href="#"></a>
                        <p>物流便捷</p>
                    </li>
                    <li>
                        <a href="#"></a>
                        <p>品质新鲜</p>
                    </li>
                    <li>
                        <a href="#"></a>
                        <p>售后无忧</p>
                    </li>
                </ul>
            </div>
            <div class="footer-main">
                <div class="footer-main-left">
                    <dl>
                        <dd>购物指南</dd>
                        <dt><a href="">购物流程</a></dt>
                        <dt><a href="">购物流程</a></dt>
                        <dt><a href="">购物流程</a></dt>
                    </dl>
                    <dl>
                        <dd>配送方式</dd>
                        <dt><a href="">配送运费</a></dt>
                        <dt><a href="">配送范围</a></dt>
                        <dt><a href="">配送时间</a></dt>
                    </dl>
                    <dl>
                        <dd>关于我们</dd>
                        <dt><a href="">平台规则</a></dt>
                        <dt><a href="">联系我们</a></dt>
                        <dt><a href="">问题反馈</a></dt>
                    </dl>
                    <dl>
                        <dd>售后服务</dd>
                        <dt><a href="">售后政策</a></dt>
                        <dt><a href="">退款说明</a></dt>
                        <dt><a href="">取消订单</a></dt>
                    </dl>
                    <dl>
                        <dd>服务热线</dd>
                        <dt><a href="" class="footer-main-left-active">在线客服 <span
                                    class="iconfont icon-customer-service"></span></a></dt>
                        <dt><a href="">客服电话400-0000-000</a></dt>
                        <dt><a href="">工作时间 周一至周日 8:00-18:00</a></dt>
                    </dl>
                </div>
                <div class="footer-main-right">
                    <div class="footer-main-right-wechat-1">
                        <div class="wechat-pic">
                            <a href="#">
                                <img src="./images/wechat.png" alt="">
                            </a>

                        </div>
                        <div class="wechat-txt">
                            <p>微信公众号</p>
                        </div>

                    </div>
                    <div class="footer-main-right-wechat">
                        <div class="wechat-pic">
                            <a href="#">
                                <img src="./images/wechat.png" alt="">
                            </a>

                        </div>
                        <div class="wechat-txt">
                            <p>微信公众号</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer-copyright">
                <ul>
                    <li><a href="#">关于我们</a></li>
                    <li><a href="#">帮助中心</a></li>
                    <li><a href="#">售后服务</a></li>
                    <li><a href="#">配送与验收</a></li>
                    <li><a href="#">商务合作</a></li>
                    <li><a href="#">搜索推荐</a></li>
                    <li class="copyright-special"><a href="#">友情链接</a></li>
                </ul>
                <p>CopyRight &copy; 小兔鲜</p>
            </div>
        </div>

    </div>
</body>

</html>